大家好，我是一名菜鳥工程師，Chris，今天來到第 21 天，JS 的高階函式 higher order function

高階函式：是指一個函式可以接受另一個函式作為參數、或是返回一個函式作為結果的函式

有了高階函式，它可以幫助提高程式碼的維護性，以下為高階函式 (Higher order function) 的舉例

1 函式是一等公民：

在 JavaScript 中，函式被視為一等公民

• 範例：指定函式，給它一個變數

const test = function () {
  console.log("hello");
};

test(); // 印出 hello

• 範例：將函式作為參數來傳遞

function sayHi() {
  return "Hello, ";
}
function greeting(hello, peopleName) {
  console.log(hello() + peopleName);
}

greeting(sayHi, "John"); // 印出 Hello, John

• 範例：回傳一個函式(使用 變數)

const sayHi = function () {
  return function () {
    console.log("Hi!");
  };
};

const newFunction = sayHi();
newFunction(); // 印出 Hi

• 範例：回傳一個函式(使用 雙括號)

const sayHi = function () {
  return function () {
    console.log("Hi!");
  };
};

sayHi()(); // 印出 Hi

2 用在 Array function 上：

- map() : 創造新的 Array

let languages = ["Java", "Python", "JS"];

let upperLang = languages.map((i) => {
  return i.toUpperCase();
});

console.log(upperLang); // 印出 ['JAVA', 'PYTHON', 'JS']

- find() : 找到符合它的第一個項目，且只會回傳 1 項

let person = [
  { name: "Chris", age: 20 },
  { name: "Tom", age: 15 },
  { name: "Jerry", age: 32 },
];

let result = person.find((man) => {
  return man.age > 18;
});
console.log(result); 
// 印出 符合的第一個項目
{name: 'Chris', age: 20}

- filter() : 找出符合它的所有項目，大於 1 項會用 Array 回傳

let person = [
  { name: "Chris", age: 20 },
  { name: "Tom", age: 15 },
  { name: "Jerry", age: 32 },
];

let result = person.filter((man) => {
  return man.age > 18;
});
console.log(result); 
// 印出 全部符合的項目
0: {name: 'Chris', age: 20}
1: {name: 'Jerry', age: 32}

- some() : 是否符合一些… 它會回傳 True 或 False

let person = [
  { name: "Chris", age: 20 },
  { name: "Tom", age: 15 },
  { name: "Jerry", age: 32 },
];

let result = person.some((man) => {
  return man.age > 18;
});

console.log(result); // 印出 true

- every() : 是否符合每個… 它會回傳 True 或 False

let person = [
  { name: "Chris", age: 20 },
  { name: "Tom", age: 15 },
  { name: "Jerry", age: 32 },
];

let result = person.every((man) => {
  return man.age > 18;
});

console.log(result); // 印出 false

- reduce() :
1 累加機器：一種累加機器，將陣列中的每個元素累積相加到最終結果，組合成一個值
reduce 有兩個參數：
- accumulator： 累加器的當前值，它是累積結果的部分
- currentValue： 陣列中當前被處理的元素

2 初始值(選擇性)：一個初始的累加器值
- 有給初始值的話，reduce 會從陣列的第一個元素開始，並將初始值設為累加器的初始值

- 沒有給初始值的話，reduce 會從陣列的第二個元素開始，並將第一個元素設為累加器的初始值

範例 1：計算陣列數字的總和

const numbers = [1, 2, 3, 4, 5];

const sum = numbers.reduce((acc, cur) => {
  return acc + cur;
}, 0);

console.log(sum); // 印出 15

範例 2：尋找陣列數字的最大值

const numbers = [10, 5, 8, 20, 3];

const max = numbers.reduce((acc, cur) => {
  return Math.max(acc, cur);
}, numbers[0]);

console.log(max); // 印出 20

★★ 總結 : 以上就是有關於高階函式說明

今天就介紹到這邊，那我們明天見囉～～

明天預計內容：JS 的 this!!!